import Vue from 'vue';

const state = {
  musicDetail: {
    name: "",
    musicUrl: "",
    singer: "",
    picUrl: "",
    duration: "0"
  },

  musicUrl: "",
  currentIndex: 0,
  musicIds: ["1463165983", "1861640530", "574921549", "417859631", "32507038", "415792881"],
  musicIndex: 0,
  hotComments: [],
  comments: [],
  commentTotal: 0,
  lyric: { times: [], contents: [] },
};
const actions = {

  // 获取音乐详情
  getMusicDetail: async ({ commit,getters }) => {
    const { songs } = await Vue.prototype.$API.player.getMusicDetail(getters.musicId);
    const musicDetail = {
      name: songs[0].name,
      singer: songs[0].ar[0].name,
      picUrl: songs[0].al.picUrl,
      album: songs[0].al.name,
      duration: songs[0].dt
    }
    commit("GETMUSICDETAIL", musicDetail)
  },

  //获取音乐地址 
  getMusicUrl: async ({ commit,getters }) => {
    const { data } = await Vue.prototype.$API.player.getMusicUrl(getters.musicId);
    const musicUrl = data[0].url;
    commit("GETMUSICURL", musicUrl)
  },

  // 获取评论
  getMusicComment: async ({ commit,getters }) => {
    let {
      comments,
      hotComments,
      total: commentTotal,
    } = await Vue.prototype.$API.player.getMusicComment(getters.musicId);
    // 整理评论数据
    comments = comments.map((item) => {
      return {
        nickname: item.user.nickname,
        avatarUrl: item.user.avatarUrl,
        userId: item.user.userId,
        content: item.content,
        liked: item.liked,
        likedCount: item.likedCount,
        time: item.time,
      };
    });

    // 整理热评数据
    hotComments = hotComments.map((item) => {
      return {
        nickname: item.user.nickname,
        avatarUrl: item.user.avatarUrl,
        userId: item.user.userId,
        content: item.content,
        liked: item.liked,
        likedCount: item.likedCount,
        time: item.time,
      };
    });
    commit("GETMUSICCOMMENT", { comments, hotComments, commentTotal })
  },

  // 获取歌词
  getMusicLyric: async ({ commit,getters }) => {
    let {
      lrc: { lyric },
    } = await Vue.prototype.$API.player.getMusicLyric(getters.musicId);
    lyric = lyric.split("[");
    let times = [];
    let contents = [];
    lyric.forEach((item) => {
      let [time, content] = item.split("]");
      times.push(time.slice(0, 5));
      contents.push(content);
    });
    times.shift();
    contents.shift();
    commit("GETMUSICLYRIC", { times, contents })
  }
}

const mutations = {
  // 设置歌曲详情
  GETMUSICDETAIL: (state, musicDetail) => {
    state.musicDetail = musicDetail
  },
  // 设置歌曲URL
  GETMUSICURL: (state, musicUrl) => {
    state.musicUrl = musicUrl
  },
  // 更新歌词下标
  UPDTATEINDEX: (state, currentIndex) => {
    state.currentIndex = currentIndex
  },

  // 更新评论
  GETMUSICCOMMENT: (state, commentObj) => {
    const { comments, hotComments, commentTotal } = commentObj
    state.comments = comments
    state.hotComments = hotComments
    state.commentTotal = commentTotal
  },
  // 更新ids数组
  UPDATEMUSICIDS:(state,musicIds)=>{
    state.musicIds = musicIds
  },


  // 更新歌曲下标
  UPDATEMUSICINDEX:(state,index)=>{
    state.musicIndex = index
  },

  // 更新歌词
  GETMUSICLYRIC: (state, lyric) => {
    state.lyric = lyric
  },

  // 下一曲
  NEXT: (state) => {
    // 每次切歌都回到最开始的位置
    state.currentIndex = 0
    if (state.musicIndex === state.musicIds.length - 1) return state.musicIndex = 0
    state.musicIndex++
  },
  // 上一曲
  PERV: (state) => {
    state.currentIndex = 0
    if (state.musicIndex === 0) return state.musicIndex = state.musicIds.length - 1
    state.musicIndex--
  }

}

const getters = {
  musicId: state => {
    // 当前musicid
    console.log("当前musicid",state.musicIds[state.musicIndex])
    localStorage.setItem("musicId",state.musicIds[state.musicIndex])
    return state.musicIds[state.musicIndex]
  },
}
export default {
  namespaced: true,
  state,
  actions,
  getters,
  mutations,
}